const path = require('path')
const HtmlWebpackPlugin = require('html-webpack-plugin')
const webpack = require('webpack')
const Happypack = require('happypack')
// 模块 happypack 可以实现多线程来打包


module.exports = {
  devServer: { // 开发服务器的配置
    port: 3030,
    // open: true, // 自动打开
    progress: true,
    contentBase: './dist',
    compress: true
  },
  // 优化项配置
  optimization: {
    splitChunks: { // 分割代码块
      cacheGroups: { // 缓存组
        common: { // 公共的模块
          priority: -20, // 权重
          chunks: 'initial',
          minSize: 0,
          minChunks: 2, // 用过2次
        },
        vendor: { // 第三方包， 抽成一个单独文件
          priority: 1, // 权重
          test: /node_modules/, // 把你抽离处理
          chunks: 'initial',
          name: 'vendor',
          minSize: 0,
          minChunks: 1, // 在分割之前，这个代码块最小应该被引用的次数
        }
      }
    }
  },
  mode: 'development', //production development
  entry: {
    index: './src/index.js',
    other: './src/other.js'
  },
  output:{
    filename: '[name].js',
    path: path.resolve(__dirname, 'dist')
  },
  module: {
    noParse: /jquery/, // 不去解析jquery中的依赖库
    rules: [
      {
        test: /\.js$/, // normal 普通的loader
        use: {
          loader: 'babel-loader',
          options: { // 用babel-loader  需要把es6->es5 presets大集合
            presets: [
              '@babel/preset-env',
              '@babel/preset-react'
            ]
          }
        },
        include: path.resolve(__dirname, 'src'),
        // 排除
        exclude: /node_modules/
      },
      {
        test: /\.css$/,
        use: ['style-loader', 'css-loader']
      }
    ]
  },
  plugins: [

    // new webpack.DllReferencePlugin({
    //   manifest: path.resolve(__dirname, 'dist', 'manifest.json')
    // }),
    new webpack.IgnorePlugin(/\.\/locale/, /moment/),
    new HtmlWebpackPlugin({
      template: './public/index.html',
      filename: 'index.html'
    }),
  ]
}
